<!-- 分享弹窗组件 -->
<template>
	<view class="">
		<!-- 分享弹窗 -->
		<u-popup :show="show" :round="30">
			<view class="sharePopup">
				<view class="top">
					<view class="icon" v-for="(item, index) in list" :key="index"
						:class="[showOpenIcon ? 'showBorder' : '']" @click="handleItem(item)">
						<image :src="item.url"></image>
						<text>{{ item.text }}</text>
					</view>
					<view class="icon" v-if="showOpenIcon" @click="$emit('openFile')">
						<image src="https://yzxk.oss-cn-hangzhou.aliyuncs.com/images/common/open.png"></image>
						<text>打开</text>
					</view>
					<view class="icon" v-if="isAuthor" @click="$emit('editHandler')">
						<image src="https://yzxk.oss-cn-hangzhou.aliyuncs.com/images/common/edit.png"></image>
						<text>编辑</text>
					</view>
					<view class="icon" v-if="isAuthor" @click="$emit('delHandler')">
						<image src="https://yzxk.oss-cn-hangzhou.aliyuncs.com/images/common/del.png"></image>
						<text>删除</text>
					</view>
				</view>
				<view class="bottoms" @click="$emit('cancel')">取消</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import {
		shareAdd
	} from '@/apis/apis.js';
	export default {
		props: {
			show: {
				type: Boolean,
				default: false
			},
			showOpenIcon: {
				type: Boolean,
				default: false
			},
			isAuthor: {
				type: Boolean,
				default: false
			},
			shareDate: {
				type: Object,
				default: {}
			},
			custom: {
				type: Number, // 是否调用分享接口
				default: -1 // 0课程 1话题 2拼单 其他不调接口
			}
		},
		data() {
			return {
				list: [{
						num: 1,
						url: 'https://yzxk.oss-cn-hangzhou.aliyuncs.com/images/common/wxIcon.png',
						text: '微信好友',
						val: 'WXSceneSession',
					},
					{
						num: 2,
						url: 'https://yzxk.oss-cn-hangzhou.aliyuncs.com/images/common/friend.png',
						text: '朋友圈',
						val: 'WXSceneTimeline'
					},
					{
						num: 3,
						url: 'https://yzxk.oss-cn-hangzhou.aliyuncs.com/images/common/copy.png',
						text: '复制链接',
						val: 'links'
					}
				],
				// base: 'http://yizhishare.mlscd.cn/#/pages/',
				// 正式
				base: 'http://share.yz-future.com/#/pages/',
				// base: 'http://yizhishare.mlscd.cn/#/pages/',
				shareId: null,
				obj: {}
			};
		},
		methods: {
			//  分享路径
			async handleItem(item) {
				// objectType 业务类型  0话题 1课程 2拼单 3个人分享
				this.obj = this.shareDate
				if (this.shareDate.objectType !== -1) {
					const res = await shareAdd({
						objectId: this.shareDate.serviceId, //业务id
						objectType: this.shareDate.objectType, //（0：课程，1：话题 2拼单）
						shareType: item.num //（1：微信好友，2：微信朋友圈，3：复制链接）
					})
					this.shareId = res.data ? res.data.id : ''
					this.obj = {
						...this.obj,
						shareId: res.data ? res.data.id : ''
					}
				}
				// 	item.num 分享方式 1微信好友，2微信朋友圈，3复制链接
				if (item.num == 3) {
					this.copyLinks()
				} else {
					this.weixinShare(item)
				}
			},
			copyLinks() {
				const path =
					`${this.base+this.handTxt(this.shareDate.objectType)}?serviceId=${this.obj.serviceId}&memberId=${this.obj.memberId}&shareId=${this.obj.shareId}`;
				uni.setClipboardData({
					data: path,
					showToast: true,
					success: res => {
						console.log(res);
					}
				});
			},
			// 分享到微信
			weixinShare(data) {
				const path = `${this.base+this.handTxt(this.shareDate.objectType)}?
				serviceId=${this.obj.serviceId}&memberId=${this.obj.memberId}&shareId=${this.obj.shareId}`;
				uni.showToast({
					title: '正在跳转',
					icon: 'loading'
				});
				// 微信SDK 取消和成功都是走的success 无法判断是否分享成功
				uni.share({
					provider: 'weixin',
					type: this.shareDate.type, // 0	图文 1	纯文字 2	纯图片 3	音乐 4	视频 5	小程序
					title: this.shareDate.title,
					summary: this.shareDate.summary,
					imageUrl: this.shareDate.imageUrl || null,
					href: path,
					scene: data.val, // WXSceneSession	分享到聊天界面 WXSceneTimeline	分享到朋友圈 WXSceneFavorite	分享到微信收藏
					success: res => {
						console.log(res);
						this.$emit('cancel');
					},
					fail: err => {
						uni.showToast({
							title: '分享失败',
							icon: 'error'
						});
					},
					complete: com => {}
				});
			},
			handTxt(v) {
				// 业务类型  0话题 1课程 2拼单
				let str = 'index/index'
				switch (Number(v)) {
					case 0:
						str = 'course/course'
						break;
					case 1:
						str = 'topic/topic'
						break;
					case 2:
						str = 'spell/spell'
						break;
				}
				console.log(v, str)
				return str
			}
		}
	};
</script>

<style lang="scss" scoped>
	.sharePopup {
		width: 100%;
		background: #f8f8f8;
		font-family: PingFang SC;
		border-radius: 30rpx 30rpx 0 0;

		.top {
			background: #fff;
			display: flex;
			flex-wrap: wrap;
			align-content: flex-start;
			border-radius: 30rpx 30rpx 0 0;

			.icon {
				width: 33.3%;
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				font-size: 28rpx;
				font-weight: 500;
				color: #000000;
				padding: 46rpx 0 42rpx 0;

				&>image {
					width: 100rpx;
					height: 100rpx;
					margin-bottom: 22rpx;
				}
			}

			.showBorder {
				border-bottom: 2rpx solid #e7e7e7;
			}
		}

		.bottoms {
			height: 94rpx;
			background: #fff;
			text-align: center;
			line-height: 94rpx;
			font-size: 30rpx;
			font-weight: 500;
			color: #1a1a1a;
			margin-top: 20rpx;
		}
	}
</style>
